// 路由文件
import Vue from 'vue'
// 引入vueRouter
import VueRouter from 'vue-router'

console.log(require)

// Vue提供的加载插件方法
Vue.use(VueRouter)

// 导入路由渲染的组件
import Film from '../views/Film'
import Nowplaying from '../views/Film/Nowplaying'
import Comingsoon from '../views/Film/Comingsoon'
import Detail from '../views/Detail'
import Login from '../views/Login'

// 定义路由规则
const rules = [
  {
    path: '/film',
    component: Film,
    meta: { islogin: true },
    // 嵌套路由要想渲染出来，需要在父组件中添加一个 渲染容器 子路由
    children: [
      {
        // name: 'aa',
        // /film/nowplaying
        path: 'nowplaying',
        component: Nowplaying,
        meta: { islogin: true },
      },
      {
        // name: 'bb',
        path: 'comingsoon',
        component: Comingsoon,
        meta: { islogin: true },
      },
      // 重定向
      {
        path: '/film',
        redirect: 'nowplaying'
      }
    ]
  },
  // 电影详情 动态路由
  {
    // 路由名称
    name: 'detail',
    // ? 0/1 可以有参数id也可以没有
    path: '/detail/:id?',
    component: Detail,
    meta: { islogin: false }
  },
  /* {
    // ? 0/1 可以有参数id也可以没有
    path:'/detail/:id/:name',
    component:Detail
  } */
  {
    path: '/login',
    component: Login,
    meta: { islogin: false }
  }

]

// 创建VueRuter实例
const router = new VueRouter({
  // 路由模式  hash history  默认的规则就为hash
  mode: 'hash',
  routes: rules
})

/* // 前置守卫  用于后台或权限判断控制所用
router.beforeEach((to, from, next) => {

  // 重定向
  // next('/login')

  // 判断是否要进行登录的验证
  if (!to.meta.islogin) {
    //不是需要登录
    next()
  } else {
    let login = false // 登录失败

    // 进行登录验证
    if (!login) { // 登录失败
      next('/login')
    } else { // 登录成功
      next()
    }
  }
})

// 后置守卫
router.afterEach((to, from, next) => {

  console.log('后置')

}) */

// 导出
export default router
